<!DOCTYPE html>
<html lang="ja">

<head>
	<meta charset="UTF-8"/>
	<meta name="keywords" content="テーマ, シンタックスハイライト, ハイライト"/>
	<link rel="stylesheet" href="../../Shared/sty/standard.css"/>
	<script defer src="../../Shared/js/toc.js"></script>
	
	<title>MacのCotEditorでテーマをカスタマイズする</title>
</head>

<body>

<h1>MacのCotEditorでテーマをカスタマイズする</h1>

<p><dfn>テーマ</dfn>は、CotEditorのエディタのカラーリング定義をまとめたものです。</p>

<figure>
	<img class="bordered" srcset="../gfx/theme@2x.png 2x" alt="テーマ設定ビューのスクリーンショット"/>
</figure>


<section>
<p>CotEditorのテーマでは、エディタの表示を構成する要素の配色を設定できます。</p>


<table>
	<thead>
		<tr><th>項目</th><th>システムカラー</th><th>不透明度</th><th>説明</th></tr>
	</thead>
	<tbody>
		<tr><th>文字</th>
			<td></td>
			<td></td>
			<td>ハイライトがされていない文字に使用される基本の文字カラー。また、行番号もここで設定したカラーが使用されます。</td>
		</tr>
		<tr><th>不可視文字</th>
			<td></td>
			<td align="center">✔︎</td>
			<td><a href="settings_window.html">「ウインドウ」設定</a>で設定できる不可視文字の表示カラー。</td>
		</tr>
		<tr><th>カーソル</th>
			<td align="center">✔︎</td>
			<td align="center">✔︎</td>
			<td>テキストの挿入ポイントに表示されるカーソルのカラー。</td>
		</tr>
		<tr><th>背景</th>
			<td></td>
			<td></td>
			<td>エディタ全体の背景。</td>
		</tr>
		<tr><th>現在の行</th>
			<td></td>
			<td align="center">✔︎</td>
			<td><a href="settings_window.html">「ウインドウ」設定</a>で現在の行を表示する設定にしたときに現在行の背景。</td>
		</tr>
		<tr><th>選択範囲</th>
			<td align="center">✔︎</td>
			<td></td>
			<td>エディタでテキストを選択したときの選択範囲の背景。</td>
		</tr>
		<tr><th>ハイライト</th>
			<td align="center">✔︎</td>
			<td></td>
			<td><a href="settings_window.html">「編集」設定</a>で「選択した文字をハイライト」を有効にしたときなどに使われる、テキストの部分ハイライト用カラー。このカラーをベースに不透明度を下げたものがハイライト背景に使われます。</td>
		</tr>
		<tr><th>シンタックス</th>
			<td></td>
			<td align="center">✔︎</td>
			<td>シンタックス定義で設定される<a href="syntax_highlight_settings.html">シンタックスハイライト</a>要素ごとのハイライト文字カラー。</td>
		</tr>
	</tbody>
</table>


<p>カーソルや選択範囲などのいくつかのエディタを構成する要素は、macOSの「外観」システム設定によって決定されるシステムカラーが存在します。CotEditorテーマで「システムカラーを使う」にチェックを入れたときは、テーマ固定のカラーではなくシステム（「システム設定」＞「外観」）で設定されたハイライトカラーが使われます。CotEditorではこのチェックを外してテーマ独自のカラーを設定することもできます。</p>

<p>不可視文字やカーソル、さらにシンタックスハイライトではカラーに不透明度を設定できます。一方、基本となる文字カラーとそのほかいくつかの項目では不透明度の設定はできません。これら不透明度をテーマで設定できない要素は、エディタの不透明度などの状態によって、自動的に不透明度が調整されることがあります。</p>

<h3>CotEditorテーマのファイルフォーマット</h3>

<p>CotEditorテーマファイルは「.cottheme」という独自の拡張子を持ち、ファイルフォーマットはJSONと16進カラーコードを基調としています。</p>
</section>


<section>
<h2>テーマを設定する</h2>

<p>設定したいテーマを選択するには、以下の操作を行います:</p>
<ol>
	<li><p>MacでCotEditorアプリ<img class="appicon" srcset="../../Shared/gfx/icon_32x32@2x.png 2x" alt=""/>に移動します。</p></li>
	<li><p>「CotEditor」＞「設定」と選択してから、「外観」をクリックします。</p></li>
	<li><p>「テーマ」リストから設定したいテーマを選択します。</p></li>
</ol>

<p>既存のテーマを参考にして独自のテーマを作成するには、アクションポップアップメニュー <object type="image/svg+xml" class="symbol" data="../../Shared/gfx/ellipsis.circle.svg">（3点リーダシンボル）</object> から「複製」を選択します。アクションポップアップメニューからカスタムしたテーマを書き出したり外部テーマを読み込むこともできます。</p>

<p>テーマを設定するには、以下の操作を行います:</p>
<ol>
	<li><p>設定するカラーのカラーウェルをクリックします。</p></li>
	<li><p>「カラー」ウインドウでカラーを選択します。</p>
		<p>変更は自動で保存されすぐに反映されます。</p>
	</li>
</ol>
</section>


<section>
<h2>テーマを外観モードで切り替える</h2>

<p>同じテーマ名で片方の末尾に「 (Dark)」が付いている対のテーマは、ウインドウの外観モードに応じて自動的にテーマが切り替わって使用されます。このとき、ライトモード用のテーマ名はテーマ名のみ、または末尾に「 (Light)」が付いたものどちらでもかまいません。例えば、内蔵されているテーマのうち「Anura」と「Anura (Dark)」は対になっており、ライトモードのときは「Anura」が、ダークモードのときは「Anura (Dark)」が使われます。</p>

<p>ただし、外観テーマと逆のテーマをデフォルトテーマとして設定したときは、外観モードに関わらずそちらが優先して使われます。</p>
</section>


<section id="cf">
<h2>関連項目</h2>
<ul>
	<li><a href="settings_appearance.html">MacのCotEditorで「外観」設定を変更する</a></li>
</ul>
</section>

</body>
</html>
